/*
 * @Descripttion: GGB
 * @version: 1.0
 * @Author: GGB
 * @Date: 2022-01-16 18:11:39
 * @LastEditors: GGB
 * @LastEditTime: 2022-01-16 18:18:47
 */
import React, { useState, useEffect } from 'react'
const MouseTracker = () => {
    const [positions, setPositions] = useState({ x: 0, y: 0 })
    useEffect(() => {
        const updateMouse = (event) => {
            console.log('inner')
            setPositions({
                x: event.clientX,
                y: event.clientY
            })
        }
        console.log('add listener')
        document.addEventListener('click', updateMouse)
        return () => {
            console.log('remove listener')
            document.removeEventListener('click', updateMouse)
        }
    })
    return (
        <p>
            X:{positions.x},
            Y:{positions.y}
        </p>
    )
}

export default MouseTracker